<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Group of Photographic Artists</title>
<script src="<?php echo HTTP_SERVER; ?>js/jquery.js" type="text/javascript"></script>
<link rel="stylesheet" href="<?php echo HTTP_SERVER; ?>css/default/design.css" type="text/css">

<!-- start jQuery menu -->
<link type="text/css" href="<?php echo HTTP_SERVER; ?>css/menu_apycom/menu.css" rel="stylesheet" />
<script type="text/javascript" src="<?php echo HTTP_SERVER; ?>js/menu_apycom/menu.js"></script>
<!-- end of jQuery menu -->

<!-- start Lightbox Gallery Image-->
<script src="<?php echo PAGE_URL; ?>js/prettyPhoto.js" type="text/javascript"></script>
<script src="<?php echo PAGE_URL; ?>js/prettyComments.js" type="text/javascript"></script>
<link rel="stylesheet" href="<?php echo PAGE_URL; ?>css/prettyPhoto.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo PAGE_URL; ?>css/ImageGallery.css" type="text/css" media="screen"/>
<!-- end Lightbox Gallery Image -->

</head>
<body>

<div id="root">
<div id="Table_01">
	<div id="index">
    	<div id="leftTop">
            <img class="logo" src="<?php echo HTTP_SERVER; ?>images/default/logogpa.png" width="310" height="90" alt="Logo GPA">
        </div>
  		<div id="rightTop">
        	<div id="rTop">
            	<div class="login">
                	<div class="login-text">
                		<a href="#">Sign In </a> | <a href="#"> Register </a>
                    </div>
                    <div class="login-box">
                    	<input name="login-field" type="text" maxlength="30">
                    </div>
                </div>
            </div>
        	<div id="rBottom">
        		<div id="menu">
				<ul class="menu">
				<li><a href="#" class="parent"><span>Home</span></a>
				
				</li>
				<li><a href="#"><span>Product Info</span></a>
					<div><ul>
						<li><a href="#" class="parent"><span>Sub Item 1</span></a>
							<div><ul>
							<li><a href="#"><span>Sub Item 1.1</span></a></li>
							<li><a href="#"><span>Sub Item 1.2</span></a></li>
							</ul></div>
						</li>
						<li><a href="#" class="parent"><span>Sub Item 2</span></a>
							<div><ul>
							<li><a href="#"><span>Sub Item 2.1</span></a></li>
							<li><a href="#"><span>Sub Item 2.2</span></a></li>
							</ul></div>
						</li>
						<li><a href="#"><span>Sub Item 3</span></a></li>
						<li><a href="#"><span>Sub Item 4</span></a></li>
						<li><a href="#"><span>Sub Item 5</span></a></li>
						<li><a href="#"><span>Sub Item 6</span></a></li>
						<li><a href="#"><span>Sub Item 7</span></a></li>
					</ul></div>
				</li>
				<li><a href="#"><span>Help</span></a></li>
				<li class="last"><a href="#"><span>Contacts</span></a></li>
			</ul>
			</div>
        	</div>   
    	</div> 	
	</div>
	<div id="index002">
    	<div class="content">
            <ul class="gallery-detail">
            <li>
                <a href="<?php echo $detail['view_url'];?>" rel="prettyPhoto" title="<?php echo $detail['description'];?>">
                    <img src="<?php echo $detail['img_url'];?>" alt="<?php echo $detail['title'];?>" />
                </a>
                <div class="fav-sign">
                    <a href="#">
                        <img src="<?php echo HTTP_SERVER ?>images/fav.png" alt="My Favourites Picture">

                        <div class="fav-label">
                            My Favourites Picture
                        </div>
                    </a>
                </div>
                <div id="comments">
                    <!--<div class="user-photo">
                        <img src="../User/images/hanny.setiawan.jpg">
                    </div>-->
                    <div class="comment-section">
                        <div class="comment-label">Comments :</div>
                        <div class="comment-area">
                            <textarea id="comment-field" name="comment-field" rows="3" cols="30">Place your comment here...</textarea>
                        </div>
                        <div class="comment-button">
                            <input type="submit" id="comment-submit" value="Comment"/>
                        </div>
                    </div>
                </div>
                 <div id="other-comments">
                    <!--<div class="user-photo">
                        <img src="../User/images/hanny.setiawan.jpg">
                    </div>-->
                    <div class="other-comment-section">
                        <div class="other-comment-nubs">
                        </div>
                        <div class="other-comment-area">
                            <?php if($j=count($detail['comments'])) { ?>
                                <?php for($i=0;$i<$j;$i++) { ?>
                                <div class="other-comment-detail">
                                    <div class="other-comment-detail-comment">
                                        <div class="other-comment-label">
                                            Comment #<?php echo intval($i+1); ?>
                                        </div>
                                        <div class="other-comment-comment">
                                            <?php echo $detail['comments'][$i]['comment']; ?>
                                            <p style="font-size: 8px; color: #fff; text-align: right; padding: 0; margin: 5px 0 0 0;">
                                                <?php echo $detail['time_stamp'];?>
                                            </p>
                                        </div>
                                    </div>
                                    <?php if(!$detail['comments'][$i]['liked']) { ?>
                                    <div class="good-comment">
                                        <a id="comment-<?php echo $detail['comments'][$i]['comment_id']; ?>" class="comment-like" href="#comment-<?php echo $detail['comments'][$i]['comment_id']; ?>">
                                            <img src="<?php echo HTTP_SERVER; ?>images/gg-sign.png" class="gg-sign" alt="Good Comment!"/> <span style="color: #555">Good!</span>
                                        </a>
                                    </div>
                                    <?php } ?>
                                </div>
                                <?php } ?>
                            <?php } else { ?>
                            <p style="margin: 10px">No Comment Yet</p>
                            <?php } ?>
                        </div>
                    </div>
                </div>
            </li>
	</ul>

        <script type="text/javascript">
            $(function(){
                $("#comment-field")
                .focus(function(){
                    if($(this).val()=='Place your comment here...') $(this).val('');
                })
                .blur(function(){
                    if($(this).val()=='') $(this).val('Place your comment here...');
                })
                .prettyComments();
                $(".gallery-detail a[rel^='prettyPhoto']").prettyPhoto({theme:'dark_rounded'});
                $("#comment-submit").click(function(){
                    if($("#comment-field").val().length && $("#comment-field").val()!='Place your comment here...') {
                        $.post("<?php echo HTTP_SERVER; ?>?page=gallery&act=comment&iid=<?php echo $imageId;?>", $("#comment-field").serialize(), function(d,s){if(s=="success"){alert(d);window.location=window.location;}});
                    }
                });

                $(".comment-like").click(function(e){
                    e.preventDefault();
                    e.stopPropagation();

        $.post("<?php echo HTTP_SERVER; ?>", {"cid":$(this).attr('id').replace("#comment-", "")}, function(d){});
                });
            });
        </script>
        </div>
	</div>
	<div id="index003">
	</div>
	<div id="index004">
	</div>
</div>
</div>
	<a id="thanks" href="http://apycom.com/">Apycom jQuery Menus</a>
</body>
</html>